<template>
  <div>
    <el-row :gutter="24">
      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        <LineSimple class="h-360px mb-24px" />
      </el-col>

      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        <LineComplex class="h-360px mb-24px" />
      </el-col>
    </el-row>

    <el-row :gutter="24">
      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        <LineArea class="h-360px mb-24px" />
      </el-col>

      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        <BarSimple class="h-360px mb-24px" />
      </el-col>
    </el-row>

    <el-row :gutter="24">
      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        <BarComplex class="h-360px mb-24px" />
      </el-col>

      <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
        <BarHorizontal class="h-360px mb-24px" />
      </el-col>
    </el-row>

    <el-row :gutter="24">
      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
        <PieSimple class="h-360px mb-24px" />
      </el-col>

      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
        <PieComplex class="h-360px mb-24px" />
      </el-col>

      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
        <PieExtend class="h-360px mb-24px" />
      </el-col>
    </el-row>

    <el-row :gutter="24">
      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
        <RadarSimple class="h-360px mb-24px" />
      </el-col> 

      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
      </el-col>

      <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
      </el-col>
    </el-row>
  </div>
</template>

<script lang="ts" setup>
import LineSimple from './components/line/simple.vue'
import LineComplex from './components/line/complex.vue'
import LineArea from './components/line/area.vue'
import BarSimple from './components/bar/simple.vue'
import BarComplex from './components/bar/complex.vue'
import BarHorizontal from './components/bar/horizontal.vue'
import PieSimple from './components/pie/simple.vue'
import PieComplex from './components/pie/complex.vue'
import PieExtend from './components/pie/extend.vue'
import RadarSimple from './components/radar/simple.vue'
</script>
